<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorate="~{layout/base}">
<head>
    <title>农产品审核 - 暖心助农选品平台</title>
</head>
<body>
    <div layout:fragment="content">
        <h2>待审核农产品</h2>

        <div th:if="${products.empty}" class="alert alert-info">
            没有待审核的农产品。
        </div>

        <div th:unless="${products.empty}" class="row row-cols-1 row-cols-md-3 g-4">
            <div class="col" th:each="product : ${products}">
                <div class="card h-100">
                    <img th:if="${product.image}" th:src="@{${product.image}}" class="card-img-top" alt="产品图片">
                    <img th:unless="${product.image}" th:src="@{/images/default-product.jpg}" class="card-img-top" alt="默认产品图片">
                    <div class="card-body">
                        <h5 class="card-title" th:text="${product.name}">产品名称</h5>
                        <p class="card-text" th:text="${product.description}">产品描述</p>
                        <p class="card-text">
                            <small class="text-muted" th:text="'类别: ' + ${product.category}">类别</small>
                        </p>
                        <p class="card-text">
                            <strong class="text-danger" th:text="'￥' + ${product.price}">价格</strong>
                        </p>
                        <p class="card-text">
                            <small class="text-muted" th:text="'库存: ' + ${product.stock}">库存</small>
                        </p>
                        <hr>
                        <div class="d-flex justify-content-between align-items-center">
                            <div>
                                <small class="text-muted">农户：</small>
                                <span th:text="${product.farmer.realName}">农户姓名</span>
                            </div>
                            <button class="btn btn-success btn-sm approve-btn" 
                                    th:data-id="${product.id}">
                                通过审核
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <th:block layout:fragment="scripts">
        <script th:inline="javascript">
            $(document).ready(function() {
                const baseUrl = /*[[@{/admin/products}]]*/ '';
                
                $('.approve-btn').click(function() {
                    const btn = $(this);
                    const productId = btn.data('id');
                    
                    if (confirm('确定要通过这个农产品的审核吗？')) {
                        $.post(baseUrl + '/' + productId + '/approve')
                            .done(function(response) {
                                if (response === 'success') {
                                    btn.closest('.col').fadeOut(function() {
                                        $(this).remove();
                                        if ($('.col').length === 0) {
                                            location.reload();
                                        }
                                    });
                                } else {
                                    alert('操作失败: ' + response);
                                }
                            })
                            .fail(function(jqXHR) {
                                console.error('Error:', jqXHR.responseText);
                                alert('操作失败: ' + (jqXHR.responseText || '未知错误'));
                            });
                    }
                });
            });
        </script>
    </th:block>
</body>
</html> 